<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/modules/cms/front/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>课程列表</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="description" content="${site.description}" />
<meta name="keywords" content="${site.keywords}" />
<link rel="stylesheet" href="${ctxStatic}/sdsng/lib/weui.min.css">
<link rel="stylesheet" href="${ctxStatic}/sdsng/css/jquery-weui.css">
<link rel="stylesheet" href="${ctxStatic}/sdsng/css/style.css">
</head>
<body ontouchstart>
<!--主体--> 
<div class="weui-content">
  <!--产品详情-->
  <div class="weui-tab">
    <div class="weui-navbar" style="position:fixed; top:0; left:0; right:0; height:44px;">
	<div class="wy-header-icon-back"><span></span></div>
 
      <a class="weui-navbar__item proinfo-tab-tit weui-bar__item--on" href="#tab1">课程详情</a> 
      <a class="weui-navbar__item proinfo-tab-tit" href="#tab2">相关评价</a>
    </div>
    <div class="weui-tab__bd proinfo-tab-con">
      <div id="tab1" class="weui-tab__bd-item weui-tab__bd-item--active">
        <!--主图轮播-->
         
        <div class="wy-media-box-nomg weui-media-box_text" >
		
          <h3 class="wy-media-box__title" style="font-size:18px"><font style="color:#C30"><b>${emsCourse.code }</b></font>${emsCourse.name }</h3>
        <div class="wy-pro-pri">¥<em class="num font-15">${emsCourse.fee }</em> <div style="float:left; margin-right:10px; color:#333333; font-size:12px">课时：${emsCourse.classHours }课时</div></div>
		    <div style="font-size:12px; color:#666666">招生人数：<b>${emsCourse.num }</b>人 剩余:<font color="red"><b>${emsCourse.num - emsCourse.hasNum}</b></font>人</div>
        </div>
        
          
        <div class="wy-media-box2 txtpd weui-media-box_text">
          <div class="weui-media-box_appmsg" style="font-size:12px; color:#333333; padding:10px; line-height:20px;">
                             所属校区：${emsCourse.major.dept.area.name }<br/>
			所属部门：${emsCourse.major.dept.name }<br/>
			所属专业：${emsCourse.major.name }<br/>
          </div>
        </div>
		<div class="wy-media-box2 txtpd weui-media-box_text">
          <div class="weui-media-box_appmsg" style="font-size:12px; color:#333333; padding:10px; line-height:20px;">
                              招生对象：${emsCourse.face }<br/>
			开课时间：<fmt:formatDate value="${emsCourse.beginTime}" pattern="yyyy-MM-dd HH:mm:ss"/><br/>
			上课时间：${emsCourse.classTime}<br/>
			任课老师：${emsCourse.teacher.name}<br/>
			上课教室：${emsCourse.classroom.name}<br/>
			备注：${emsCourse.remarks}
          </div>
        </div>
		
      </div>
     
     
      <div id="tab2" class="weui-tab__bd-item">
        <!--评价-->
        <div class="weui-panel__bd">
          <div class="wy-media-box weui-media-box_text">
            <div class="weui-cell nopd weui-cell_access">
              <div class="weui-cell__hd"><img src="${ctxStatic}/sdsng/upload/headimg.jpg" alt="" style="width:20px;margin-right:5px;display:block"></div>
              <div class="weui-cell__bd weui-cell_primary"><p>飞翔的小土豆</p></div>
              <span class="weui-cell__time">2017-02-06</span>
            </div>
            <div class="comment-item-star"><span class="real-star comment-stars-width5"></span></div>
            <p class="weui-media-box__desc">面料不错，码数也正常  男朋友穿的很合适。</p>
            <ul class="weui-uploader__files clear mg-com-img">
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
            </ul>
          </div>
        </div>
        <div class="weui-panel__bd">
          <div class="wy-media-box weui-media-box_text">
            <div class="weui-cell nopd weui-cell_access">
              <div class="weui-cell__hd"><img src="${ctxStatic}/sdsng/upload/headimg.jpg" alt="" style="width:20px;margin-right:5px;display:block"></div>
              <div class="weui-cell__bd weui-cell_primary"><p>爱情海的事故</p></div>
              <span class="weui-cell__time">2017-02-06</span>
            </div>
            <div class="comment-item-star"><span class="real-star comment-stars-width3"></span></div>
            <p class="weui-media-box__desc">面料不错，码数也正常  男朋友面料不错，码数也正常  男朋友穿的面料不错，码数也正常  男朋友穿的穿的很合适。</p>
            <ul class="weui-uploader__files clear mg-com-img">
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
            </ul>
          </div>
        </div>
        <div class="weui-panel__bd">
          <div class="wy-media-box weui-media-box_text">
            <div class="weui-cell nopd weui-cell_access">
              <div class="weui-cell__hd"><img src="${ctxStatic}/sdsng/upload/headimg.jpg" alt="" style="width:20px;margin-right:5px;display:block"></div>
              <div class="weui-cell__bd weui-cell_primary"><p>爱情海的事故</p></div>
              <span class="weui-cell__time">2017-02-06</span>
            </div>
            <div class="comment-item-star"><span class="real-star comment-stars-width3"></span></div>
            <p class="weui-media-box__desc">面料不错，码数也正常  男朋友面料不错，码数也正常  男朋友穿的面料不错，码数也正常  男朋友穿的穿的很合适。</p>
            <ul class="weui-uploader__files clear mg-com-img">
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
            </ul>
          </div>
        </div>
        <div class="weui-panel__bd">
          <div class="wy-media-box weui-media-box_text">
            <div class="weui-cell nopd weui-cell_access">
              <div class="weui-cell__hd"><img src="${ctxStatic}/sdsng/upload/headimg.jpg" alt="" style="width:20px;margin-right:5px;display:block"></div>
              <div class="weui-cell__bd weui-cell_primary"><p>爱情海的事故</p></div>
              <span class="weui-cell__time">2017-02-06</span>
            </div>
            <div class="comment-item-star"><span class="real-star comment-stars-width3"></span></div>
            <p class="weui-media-box__desc">面料不错，码数也正常  男朋友面料不错，码数也正常  男朋友穿的面料不错，码数也正常  男朋友穿的穿的很合适。</p>
            <ul class="weui-uploader__files clear mg-com-img">
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)" onclick="window.location.reload('gallery.html')"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/ban2.jpg)" onclick="window.location.reload('gallery.html')"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)" onclick="window.location.reload('gallery.html')"></li>
            </ul>
          </div>
        </div>
        <div class="weui-panel__bd">
          <div class="wy-media-box weui-media-box_text">
            <div class="weui-cell nopd weui-cell_access">
              <div class="weui-cell__hd"><img src="${ctxStatic}/sdsng/upload/headimg.jpg" alt="" style="width:20px;margin-right:5px;display:block"></div>
              <div class="weui-cell__bd weui-cell_primary"><p>爱情海的事故</p></div>
              <span class="weui-cell__time">2017-02-06</span>
            </div>
            <div class="comment-item-star"><span class="real-star comment-stars-width3"></span></div>
            <p class="weui-media-box__desc">面料不错，码数也正常  男朋友面料不错，码数也正常  男朋友穿的面料不错，码数也正常  男朋友穿的穿的很合适。</p>
            <ul class="weui-uploader__files clear mg-com-img">
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
                <li class="weui-uploader__file" style="background-image:url(${ctxStatic}/sdsng//upload/pro3.jpg)"></li>
            </ul>
          </div>
        </div>
        <a href="javascript:void(0);" class="weui-cell weui-cell_access weui-cell_link list-more">
            <div class="weui-cell__bd">查看更多</div>
            <span class="weui-cell__ft"></span>
          </a>
        
      </div>
    </div>
  </div>  
</div>
<span id="tophovertree" title="返回顶部"></span>
<!--底部导航-->
<div class="foot-black"></div>
<div class="weui-tabbar wy-foot-menu">
  
  <a href="javascript:;" id='show-toast' class="promotion-foot-menu-items">
    <div class="weui-tabbar__icon promotion-foot-menu-collection"></div>
    <p class="weui-tabbar__label">收藏</p>
  </a>
  <a href="shopcart.html" class="promotion-foot-menu-items">
    <span class="weui-badge" style="position: absolute;top: -.4em;right: 1em;">8</span>
    <div class="weui-tabbar__icon promotion-foot-menu-cart"></div>
    <p class="weui-tabbar__label">购物车</p>
  </a>
  <a href="javascript:;" class="weui-tabbar__item yellow-color open-popup" data-target="#join_cart">
    <p class="promotion-foot-menu-label">加入购物车</p>
  </a>
  <a href="javascript:;" class="weui-tabbar__item red-color open-popup" data-target="#selcet_sku">
    <p class="promotion-foot-menu-label">立即付款</p>
  </a>
</div>
<div id="join_cart" class='weui-popup__container popup-bottom' style="z-index:600;">
  <div class="weui-popup__overlay" style="opacity:1;"></div>
  <div class="weui-popup__modal">
    <div class="modal-content">
      <div class="weui-msg" style="padding-top:0;">
        <div class="weui-msg__icon-area"><i class="weui-icon-success weui-icon_msg"></i></div>
        <div class="weui-msg__text-area">
          <h2 class="weui-msg__title">成功加入购物车</h2>
          <p class="weui-msg__desc">亲爱的用户，您的商品已成功加入购物车，为了保证您的商品快速送达，请您尽快到购物车结算。</p>
        </div>
        <div class="weui-msg__opr-area">
          <p class="weui-btn-area">
            <a href="shopcart.html" class="weui-btn weui-btn_primary">去购物车结算</a>
            <a href="javascript:;" class="weui-btn weui-btn_default close-popup">不，我再看看</a>
          </p>
        </div>
      </div>
    </div>
  </div>
</div>
<div id="selcet_sku" class='weui-popup__container popup-bottom' style="z-index:600;">
  <div class="weui-popup__overlay" style="opacity:1;"></div>
  <div class="weui-popup__modal">
   
    <div class="modal-content">
      <div class="weui-msg" style="padding-top:0;">
         
        <div class="weui-msg__opr-area">
          <p class="weui-btn-area">
            <a href="order_info.html" class="weui-btn weui-btn_primary">立即购买</a>
            <a href="javascript:;" class="weui-btn weui-btn_default close-popup">不，我再看看</a>
          </p>
        </div>
      </div>
    </div>
  </div>
</div>

<script src="${ctxStatic}/sdsng/lib/jquery-2.1.4.js"></script> 
<script src="${ctxStatic}/sdsng/lib/fastclick.js"></script> 
<script>
  $(function(){
    FastClick.attach(document.body);
  });
</script> 
<script src="${ctxStatic}/sdsng/js/jquery-weui.js"></script>
<script src="${ctxStatic}/sdsng/js/swiper.js"></script>
<script>
$(".swiper-zhutu").swiper({
        loop: true,
		paginationType:'fraction',
        autoplay:5000
      });
</script>
<script>
$(function(){
	$(".promotion-sku li").click(function(){
		$(this).addClass("active").siblings("li").removeClass("active");
		})
	})
</script>
<script>
      $(document).on("click", "#show-toast", function() {
        $.toast("收藏成功", function() {
          console.log('close');
        });
      })
</script>
<script>
      $(document).on("open", ".weui-popup-modal", function() {
        console.log("open popup");
      }).on("close", ".weui-popup-modal", function() {
        console.log("close popup");
      });
    </script>
<script>
	$(function (){initTopHoverTree("tophov"+"ertree",30,10,10); })
</script>
<script>
	function initTopHoverTree(hvtid, times, right, bottom) {
		$("#" + hvtid).css("right", right).css("bottmo", bottom);
		$("#" + hvtid).on("click", function () { goTopHovetree(times); })
		$(window).scroll(function () {
		if ($(window).scrollTop() > 268) {
		$("#" + hvtid).fadeIn(100);
		}
		else {
		$("#" + hvtid).fadeOut(100);
		}
		});
	}
	//返回顶部动画
	//goTop(500);//500ms内滚回顶部
	function goTopHovetree(times) {
		if (!!!times) {
		$(window).scrollTop(0);
		return;
		}
		var sh = $('body').scrollTop();//移动总距离
		var inter = 13.333;//ms,每次移动间隔时间
		var forCount = Math.ceil(times / inter); //移动次数
		var stepL = Math.ceil(sh / forCount); //移动步长
		var timeId = null;
		function aniHovertree() {
		!!timeId && clearTimeout(timeId);
		timeId = null;
		//console.log($('body').scrollTop());
		if ($('body').scrollTop() <= 0 || forCount <= 0) {//移动端判断次数好些，因为移动端的scroll事件触发不频繁，有可能检测不到有<=0的情况
		$('body').scrollTop(0);
		return;
		}
		forCount--;
		sh -= stepL;
		$('body').scrollTop(sh);
		timeId = setTimeout(function () { aniHovertree(); }, inter);
		}
		aniHovertree();
	}
</script>
</body>
</html>